$breakpoints: (
	'phone': (320px, 750px),
	'android': 1080px
);

@mixin respond-to($breakname){
	$bp: map-get($breakpoints, $breakname);
	@if (type-of($bp) == 'list') {
		$min: nth($bp, 1);
		$max: nth($bp, 2);
		@media (min-width: $min) and (max-width: $max) {
			@content;
		}
	}
	@else {
		@media (min-width: $bp) {
			@content;
		}
	}
}

@mixin fron-display($display, $justify, $align){
	display: $display;
	justify-content: $justify;
	align-items: $align;
}

@mixin hidden-webkit($lineNum){
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: $lineNum;
	-webkit-box-orient: vertical;
}

@mixin hidden-overflow(){
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}